<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">

    <title>无限极创新资讯分享后台</title>
    <link href="images/style.css" rel="stylesheet" type="text/css" />
    <script src="http://cdn.bootcss.com/jquery/2.1.3/jquery.min.js"></script>
    <script src="js/common.js"></script>
</head>
    
<body>     
    <div id="source-wrap">
        <span class="hh">筛选条件</span>
        <div class="slide"></div>
        <div class="part">
             <div class="rsspart">
                 <span>按RSS筛选</span>
                 <div class="show">
                   请选择
                 </div>
                 <select class="selectbox">
                   <option selected value="">请选择</option>
                   <option value="1">1</option>
                   <option value="2">2</option>
                   <option value="3">3</option>
                   <option value="4">4</option>
                 </select>
             </div>
             <div class="wordpart">
                 <span>关键字</span>
                 <input type="text">
                 <img src="images/search.png" alt="">
             </div>        
        </div>

        <div class="table">
            <div class="head">
               <li class="checkbox"></li>
               <li class="idname">ID</li>
               <li class="tagname">文档标题</li>
               <li class="along">RSS</li>
               <li class="linktag">发布时间</li>
               <li class="note">抓取时间</li>
               <li class="same">预标签</li>
               <li class="setup">操作</li>
            </div>

            <div class="detail">
               <!-- <li class="checkbox">
                    <input type="checkbox">
                </li>
               <li class="idname">1</li>
               <li class="tagname">无企业管理</li>
               <li class="along">职员</li>
               <li class="linktag">2015年08月22日</li>
               <li class="note">2015年08月22日</li>
               <li class="same">Infinitus,INFINITUS</li>
               <li class="setup">
                 <div class="show">
                   请选择
                 </div>
                 <select class="selectbox">
                   <option selected value="">请选择</option>
                   <option value="1">1</option>
                   <option value="2">2</option>
                   <option value="3">3</option>
                   <option value="4">4</option>
                 </select>
               </li> -->
            </div>
            
        </div>

        <div class="foot">          
            <input type="checkbox" id="all" class="istrue" />
            <label for="all">全选</label>
            <span>批量删除</span>
            <span class='ad'>批量添加标签</span>
            <div class="page">
              <img src="images/qiehuan1.png" alt="">
              <span>1/1</span>
              <img src="images/qiehuan2.png" alt="">
            </div>
        </div>

    </div>
</body>

<script>
	$(function(){
        //表格内容
       for(var i=0;i<10;i++){
          var str='<li class="checkbox">'+
                    '<input type="checkbox">'+
                '</li>'+
               '<li class="idname">1</li>'+
               '<li class="tagname">无企业管理</li>'+
               '<li class="along">职员</li>'+
               '<li class="linktag">2015年08月22日</li>'+
               '<li class="note">2015年08月22日</li>'+
               '<li class="same">Infinitus,INFINITUS</li>'+
              ' <li class="setup">'+
                 '<div class="show">请选择</div>'+
                 '<select class="selectbox">'+
                   '<option selected value="">请选择</option>'+
                   '<option value="1">1</option>'+
                   '<option value="2">2</option>'+
                   '<option value="3">3</option>'+
                   '<option value="4">4</option>'+
                 '</select>'+
               '</li>';
          $('.detail').append(str);
        }


        //全选按钮
       $("#all").on("click",function(){
        //console.log($(".checkbox").length);
       var pan= $(this).hasClass("istrue");
       if(pan){
        $(this).removeClass("istrue");
        $(".checkbox").find("input").prop("checked",true);
       }
       else{
        $(this).addClass("istrue");
        $(".checkbox").find("input").prop("checked",false);
       }
       });

       //模拟下拉框

       $(".setup .selectbox").change(function(e){
          var thisval=$(e.currentTarget).val();
          $(this).parent().find(".show").text(thisval);
       });
       $(".rsspart .selectbox").change(function(e){
          var thisval=$(e.currentTarget).val();
          $(this).parent().find(".show").text(thisval);
       });

  })
</script>

</html>


